.topo {
	position: relative;
	width: 100%;
	height: 100%;
	padding-left: 5%;
	.topo-bg {
		position: relative;
		width: 95%;
		height: 100%;
		background-image: url("@public/images/decoration/power/12.png");
		background-repeat: no-repeat;
		background-position: center;
		background-size: contain;
	}
	.alarmTab {
		position: absolute;
		right: 5.5%;
		bottom: 40px;
		width: 360px;
		height: 168px;
		background: url("@public/images/decoration/power/center/warningTab.png") 0 0 no-repeat no-repeat;
		background-size: cover;
		animation: flicker 1500ms infinite;
		.title {
			position: absolute;
			top: -10px;
			left: 20px;
			display: flex;
			align-items: center;
			width: 90px;
			height: 22px;
			img {
				width: 14.3px;
				height: 14.29px;
				margin-right: 5px;
			}
			span {
				font-family: "PingFang SC Heavy";
				font-size: 16px;
				font-weight: 900;
				color: #ffffff;
				text-align: left;
			}
		}
		.content {
			width: 100%;
			height: 100%;
			padding: 34px 24px 24px;
			margin: 0;
			span {
				display: inline-block;
				width: 100%;
				height: 20px;
				margin: 0 0 10px;
				font-family: "PingFang SC Medium";
				font-size: 14px;
				font-weight: 500;
				color: #ffffff;
				text-align: left;
				&:last-child {
					margin: 0;
				}
			}
		}
		.close {
			position: absolute;
			top: 10px;
			right: 20px;
			color: #ffffff;
			cursor: pointer;
		}
	}
	.alarmTab:hover {
		opacity: 1;
		animation: none;
	}
	.normalBox {
		position: absolute;
		width: 210px;
		height: 98px;
	}
	.normalTab {
		width: 215px;
		height: 98px;
		background: url("@public/images/decoration/power/center/normal.png") 0 0 no-repeat no-repeat;
		background-size: cover;
		transform: scale(0.9, 0.9);
		.tl {
			display: flex;
			align-items: center;
			width: 100%;
			height: 64px;
			padding: 0 19px;
			margin: 0;
			img {
				width: 26px;
				height: 24px;
				margin-right: 28px;
			}
			span {
				margin-right: 20px;
				font-family: "PingFang SC";
				font-size: 14px;
				font-weight: 400;
				color: #ffffff;
				text-align: left;
			}
			p {
				font-family: "PingFang SC";
				font-size: 14px;
				font-weight: 400;
				color: #ffffff;
				text-align: left;
			}
		}
	}
	.warningTab {
		position: absolute;
		width: 210px;
		height: 98px;
		background: url("@public/images/decoration/power/center/warning.png") 0 0 no-repeat no-repeat;
		background-size: cover;
		transform: scale(0.9, 0.9);
		.tl {
			display: flex;
			align-items: center;
			width: 100%;
			height: 64px;
			padding: 0 19px;
			margin: 0;
			img {
				width: 26px;
				height: 24px;
				margin-right: 28px;
			}
			span {
				margin-right: 20px;
				font-family: "PingFang SC";
				font-size: 14px;
				font-weight: 400;
				color: #ffffff;
				text-align: left;
			}
			p {
				font-family: "PingFang SC";
				font-size: 14px;
				font-weight: 400;
				color: #ffffff;
				text-align: left;
			}
		}
	}
}
